﻿import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Window 2.15
import QtQuick.Layouts 1.15
import QtQuick.Controls 1.4 as Controls
import Qt.labs.qmlmodels 1.0
import com.example.buttonmanager 1.0

import "." // 导入项目的根目录

Window {
    id: canPage
    visible: true
    title: "CAN Tool"
    width: 1300
    height: 768
    minimumWidth: 1300 // 设置最小宽度
    minimumHeight: 768 // 设置最小高度

    property int canDataCount: 0
    property bool canisok: false
    property bool canInitisok: false
    property bool canResetisok: false
    property bool canStartisok: false

    // 主界面
    Rectangle {
        id: canPageRectangle
        anchors.fill: parent
        color: "#D6EAF8"

        // 设置组容器
        Rectangle {
            id: settingsGroupContainer
            width: parent.width * 0.23
            height: parent.height * 0.30
            color: "transparent" // 设置为透明，只显示边框
            border.color: "black" // 边界框颜色
            anchors.top: parent.top
            anchors.left: parent.left
            anchors.margins: 10

            GroupBox {
                id: settingsGroup
                title: "设置"
                anchors.fill: parent

                Column {
                    anchors.fill: parent
                    spacing: 10
                    //padding: 10

                    Column {
                        spacing: 10

                        Row {
                            spacing: 10

                            Text {
                                text: "设备类型："
                                font.pixelSize: 14
                            }

                            ComboBox {
                                id: deviceTypeCombo
                                model: ["USBCAN-2A", "USBCAN-2C", "CANalyst-II"]
                                width: 120
                                height: 30

                                background: Rectangle {
                                   border.color: "#C0C0C0" // 边框颜色，浅灰色
                                   border.width: 1       // 边框宽度
                                   //radius: 5             // 可选：圆角半径
                                   color: "#E0E0E0"      // 背景颜色，浅灰色
                                }
                            }
                        }

                        Row {
                            spacing: 10

                            Text {
                                text: "设备索引："
                                font.pixelSize: 14
                            }
                            ComboBox {
                                id: deviceIndexCombo
                                model: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
                                width: 120
                                height: 30

                                background: Rectangle {
                                   border.color: "#C0C0C0" // 边框颜色，浅灰色
                                   border.width: 1       // 边框宽度
                                   color: "#E0E0E0"      // 背景颜色，浅灰色
                                }

                                onActivated: {
                                    var selectedPort = deviceIndexCombo.currentText;
                                    console.log("设备索引 (无符号整数)： " + selectedPort);
                                    // 调用 C++ 函数
                                    cantester.canQmlToCppdeviceIndex(selectedPort);  // 此处可以根据需要传递更多参数
                                }

                            }

                        }

                        Row {
                            spacing: 10

                            Text {
                                text: "  波特率："
                                font.pixelSize: 14
                            }

                            ComboBox {
                                id: baudRateCombo
                                model: ["20Kbps", "40Kbps", "50Kbps", "80Kbps", "100Kbps", "125Kbps", "200Kbps", "250Kbps", "400Kbps", "500Kbps",
                                        "666Kbps", "800Kbps", "1000Kbps", "33.33Kbps", "66.66Kbps", "83.33Kbps",]
                                width: 120
                                height: 30

                                onActivated: {
                                    var selectedPort = baudRateCombo.currentText;
                                    var numericPort;

                                    // 检查波特率是否包含 "Kbps" 或 "Mbps"，并提取数字部分
                                    if (selectedPort.indexOf("Kbps") !== -1) {
                                        numericPort = selectedPort.replace("Kbps", "");  // 去除 "Kbps"
                                        console.log("选择的波特率： " + selectedPort + "，数字波特率： " + numericPort);
                                        numericPort = parseFloat(numericPort);  // 转换为浮动数值
                                    } else if (selectedPort.indexOf("Mbps") !== -1) {
                                        numericPort = selectedPort.replace("Mbps", "");  // 去除 "Mbps"
                                        console.log("选择的波特率： " + selectedPort + "，数字波特率： " + numericPort);
                                        numericPort = parseFloat(numericPort);  // 转换为浮动数值
                                    } else {
                                        console.log("无效的波特率格式");
                                        return;
                                    }

                                    // 假设 `canQmlToCpp()` 函数接收一个数字波特率（无符号整数）
                                    var numericPortUInt = Math.round(numericPort);  // 转为整数
                                    console.log("最终波特率 (无符号整数)： " + numericPortUInt);

                                    // 调用 C++ 函数
                                    cantester.canQmlToCpp(numericPortUInt);  // 此处可以根据需要传递更多参数
                                }

                                background: Rectangle {
                                   border.color: "#C0C0C0" // 边框颜色，浅灰色
                                   border.width: 1       // 边框宽度
                                   color: "#E0E0E0"      // 背景颜色，浅灰色
                                }
                            }

                        }

                        Row {
                            spacing: 10

                            Button {
                                id: canOpenDevice
                                text: "打开设备"
                                width: 120
                                height: 30
                                onClicked: {
                                    if("打开设备")
                                    {
                                        console.log("打开设备")
                                        // 调用 C++ 函数
                                        canisok = cantester.canOpenDevice();  // 返回布尔值：true 成功，false 失败
                                        if(canisok)
                                        {
                                            canOpenDevice.text = "关闭设备"

                                        }
                                        else
                                        {
                                            errorDialog.open()
                                        }
                                    }
                                    else
                                    {
                                        canOpenDevice.text = "打开设备"
                                        cantester.canCloseDevice()
                                    }

                                }

                                background: Rectangle {
                                   border.color: "#C0C0C0" // 边框颜色，浅灰色
                                   border.width: 1       // 边框宽度
                                   color: "#E0E0E0"      // 背景颜色，浅灰色
                                }
                            }

                            // Dialog 弹窗
                            Dialog {
                                id: errorDialog
                                title: "设备打开失败"
                                //modality: Qt.ApplicationModal // 设置为模态弹窗，不能与其他窗口交互
                                anchors.centerIn: parent

                                // Dialog 内容
                                Column {
                                    spacing: 10
                                    Text {
                                        text: "无法打开设备，请检查设备连接。"
                                        color: "red"
                                    }
                                    Button {
                                        width: 100
                                        height: 30
                                        text: "确定"
                                        anchors.horizontalCenter: parent.horizontalCenter
                                        onClicked: {
                                            errorDialog.close() // 关闭弹窗
                                        }

                                        background: Rectangle {
                                            width: parent.width
                                            height: parent.height
                                           border.color: "#C0C0C0" // 边框颜色，浅灰色
                                           border.width: 1       // 边框宽度
                                           color: "#E0E0E0"      // 背景颜色，浅灰色
                                        }
                                    }
                                }
                            }

                            Button {
                                text: "复位"
                                width: 120
                                height: 30
                                onClicked: {
                                    canResetisok = cantester.canResetDevice()
                                    if(canResetisok)
                                    {
                                        console.log("复位设备")
                                    }
                                    else
                                    {
                                        console.log("复位设备失败")
                                    }
                                }

                                background: Rectangle {
                                   border.color: "#C0C0C0" // 边框颜色，浅灰色
                                   border.width: 1       // 边框宽度
                                   color: "#E0E0E0"      // 背景颜色，浅灰色
                                }
                            }
                        }

                        Row {
                            spacing: 10

                            Button {
                                text: "初始化CAN"
                                width: 120
                                height: 30
                                onClicked: {

                                    canInitisok = cantester.canInitDevice()
                                    if(canInitisok)
                                    {
                                        console.log("初始化CAN")
                                    }
                                    else
                                    {
                                        console.log("初始化CAN失败")
                                    }

                                }

                                background: Rectangle {
                                   border.color: "#C0C0C0" // 边框颜色，浅灰色
                                   border.width: 1       // 边框宽度
                                   color: "#E0E0E0"      // 背景颜色，浅灰色
                                }
                            }

                            Button {
                                text: "启动CAN"
                                width: 120
                                height: 30
                                onClicked: {
                                    canStartisok = cantester.canStartDevice()
                                    if(canStartisok)
                                    {
                                        console.log("启动CAN")
                                    }
                                    else
                                    {
                                        console.log("启动CAN失败")
                                    }
                                }

                                background: Rectangle {
                                   border.color: "#C0C0C0" // 边框颜色，浅灰色
                                   border.width: 1       // 边框宽度
                                   color: "#E0E0E0"      // 背景颜色，浅灰色
                                }
                            }

                        }
                    }
                }
            }
        }

        // 接口板信息组容器
        Rectangle {
            id: reciverBoardContainer
            width: parent.width * 0.15
            height: parent.height * 0.30
            color: "transparent" // 设置为透明，只显示边框
            border.color: "black" // 边界框颜色
            anchors.top: parent.top
            anchors.left: settingsGroupContainer.right
            anchors.margins: 10

            GroupBox {
                id: reciverBoardGroup
                title: "接口板信息"
                anchors.fill: parent

                Column {
                    anchors.fill: parent
                    spacing: 10

                    Column {
                        spacing: 10

                        Row {
                            spacing: 10

                            Text {
                                text: "CAN通道数："
                                font.pixelSize: 14
                            }

                            Text {
                                text: cantester.rcvCan_Num   //"N/A"
                                font.pixelSize: 14
                            }
                        }


                        Row {
                            spacing: 10

                            Text {
                                text: "硬件版本号："
                                font.pixelSize: 14
                            }

                            Text {
                                text: cantester.rcvHw_Version //"N/A"
                                font.pixelSize: 14
                            }
                        }


                        Row {
                            spacing: 10

                            Text {
                                text: "接口库版本号："
                                font.pixelSize: 14
                            }

                            Text {
                                text: cantester.rcvDr_Version //"N/A"
                                font.pixelSize: 14
                            }
                        }

                        Row {
                            spacing: 10

                            Text {
                                text: "中断号："
                                font.pixelSize: 14
                            }

                            Text {
                                text: cantester.rcvIr_Version //"N/A"
                                font.pixelSize: 14
                            }
                        }
                    }
                }
            }
        }

        // 数据发送组容器
        Rectangle {
            id: sendGroupContainer
            width: parent.width * 0.40
            height: parent.height * 0.30
            color: "transparent" // 设置为透明，只显示边框
            border.color: "black" // 边界框颜色
            anchors.top: parent.top
            anchors.left: reciverBoardContainer.right
            anchors.margins: 10

            GroupBox {
                id: sendGroup
                title: "数据发送"
                anchors.fill: parent

                Column {
                    anchors.fill: parent
                    spacing: 10

                    Column {
                        spacing: 10

                        Row {
                            spacing: 10

                            Text {
                                text: "ID(0x)："
                                font.pixelSize: 14
                            }

                            TextField {
                                id: canId0xInput
                                text:  "00000000"
                                width: 100
                                height: 30
                            }

                            ComboBox {
                                id: channelCombo
                                model: ["通道 0", "通道 1"]
                                width: 120
                                height: 30

                                background: Rectangle {
                                   border.color: "#C0C0C0" // 边框颜色，浅灰色
                                   border.width: 1       // 边框宽度
                                   color: "#E0E0E0"      // 背景颜色，浅灰色
                                }

                                onActivated: {
                                    console.log("通道 :", channelCombo.currentIndex)
                                    cantester.canChannel(channelCombo.currentIndex);
                                }
                            }
                        }


                        Row {
                            spacing: 10


                            ComboBox {
                                id: frameTypeCombo
                                model: ["标准帧", "扩展帧"]
                                width: 100
                                height: 30

                                background: Rectangle {
                                   border.color: "#C0C0C0" // 边框颜色，浅灰色
                                   border.width: 1       // 边框宽度
                                   color: "#E0E0E0"      // 背景颜色，浅灰色
                                }

                                onActivated: {
                                    console.log("帧 :", frameTypeCombo.currentIndex)
                                    cantester.canFrameStandardOrExtend(frameTypeCombo.currentIndex)
                                }
                            }

                            ComboBox {
                                id: framedataCombo
                                model: ["数据帧", "远程帧"]
                                width: 100
                                height: 30

                                background: Rectangle {
                                   border.color: "#C0C0C0" // 边框颜色，浅灰色
                                   border.width: 1       // 边框宽度
                                   color: "#E0E0E0"      // 背景颜色，浅灰色
                                }


                                onActivated: {
                                    console.log("帧 :", framedataCombo.currentIndex)
                                    cantester.canFrameDataOrRemote(frameTypeCombo.currentIndex)
                                }
                            }

                            Button {
                                text: "发送"
                                width: 100
                                height: 30
                                onClicked: {

                                    // 发送数据
                                    console.log("发送数据Id0x: ", canId0xInput.text)
                                    console.log("数据(0x,以空格隔开): ", canSendData.text)
                                    cantester.canId0x(canId0xInput.text)
                                    cantester.canSendData(canSendData.text)

                                    // 每次点击时增加一行新的数据
                                    var newCanIndex = canDataCount;
                                    var systemTime =  Qt.formatTime(new Date(), "hh:mm:ss.zzz");
                                    var systemTimeFlag = "N/A";
                                    var systemTimeFlagS = "N/A";
                                    var canChennel = channelCombo.currentText;
                                    var transformDirection = "发送";
                                    var idNumer = canId0xInput.text;
                                    var frameType = frameTypeCombo.currentValue;
                                    var frameFormat = framedataCombo.currentValue;
                                    var length = "11";
                                    var newData = canSendData.text;
                                    receiveModel.append({ index: newCanIndex, systentime:systemTime, timeflag: systemTimeFlag, timeflags:systemTimeFlagS,
                                                        canchennel:canChennel,direction:transformDirection, numer:idNumer,
                                                        type:frameType, format:frameFormat, length:length,data:newData});
                                    tableBody.contentY = tableBody.contentHeight; // 自动滚动到底部
                                    canDataCount = canDataCount + 1
                                }

                                background: Rectangle {
                                   border.color: "#C0C0C0" // 边框颜色，浅灰色
                                   border.width: 1       // 边框宽度
                                   color: "#E0E0E0"      // 背景颜色，浅灰色
                                }
                            }
                        }


                        Row {
                            spacing: 10

                            Text {
                                text: "数据(0x,以空格隔开)："
                                font.pixelSize: 14
                            }

                            TextField {
                                id: canSendData
                                text: "00 11 22 33 44 55 66 77"
                                width: 250
                                height: 30
                            }
                        }
                    }
                }
            }
        }

        // 返回主界面按钮容器
        Rectangle {
            id: backButtonContainer
            width: 100
            height: 50
            color: "transparent" // 设置为透明，只显示边框
            border.color: "black" // 边界框颜色
            anchors.top: parent.top
            anchors.left: sendGroupContainer.right
            anchors.margins: 10

            // 退出CAN测试界面，退出点击右上方"X"按钮。

            Button {
                text: "返回主界面"
                anchors.centerIn: parent
                onClicked: {
                    console.log("CAN 返回主界面")
                    canPage.visible = false
                    mainPage.visible = true
                }
            }
        }

        // 数据接收组容器
        Rectangle {
            id: receiveGroupContainer
            anchors.top: settingsGroupContainer.bottom
            anchors.left: parent.left
            anchors.right: parent.right
            anchors.bottom: parent.bottom
            color: "transparent" // 设置为透明，只显示边框
            border.color: "black" // 边界框颜色
            anchors.margins: 10

            GroupBox {
                id: receiveGroup
                title: "数据接收"
                anchors.fill: parent

                Row {
                    anchors.fill: parent
                    spacing: 10

                    Rectangle {
                        id:sendDataDisplay
                        width: parent.width * 0.88
                        height: parent.height

                        Column {
                            anchors.fill: parent

                            // 表头部分
                            Row {
                                spacing: 1
                                height: 40
                                Rectangle {
                                    width: 35
                                    height: parent.height
                                    color: "#E0E0E0"
                                    border.color: "#A0A0A0"
                                    Text {
                                        id: index
                                        anchors.centerIn: parent
                                        text: ""
                                        font.bold: true
                                    }
                                }
                                Rectangle {
                                    width: 120
                                    height: parent.height
                                    color: "#E0E0E0"
                                    border.color: "#A0A0A0"
                                    Text {
                                        id: systemTime
                                        anchors.centerIn: parent
                                        text: "系统时间"
                                        font.bold: true
                                    }
                                }
                                Rectangle {
                                    width: 120
                                    height: parent.height
                                    color: "#E0E0E0"
                                    border.color: "#A0A0A0"
                                    Text {
                                        id: systemTimeFlag
                                        anchors.centerIn: parent
                                        text: "时间标识"
                                        font.bold: true
                                    }
                                }
                                Rectangle {
                                    width: 120
                                    height: parent.height
                                    color: "#E0E0E0"
                                    border.color: "#A0A0A0"
                                    Text {
                                        id: systemTimeFlagS
                                        anchors.centerIn: parent
                                        text: "时间标识(s)"
                                        font.bold: true
                                    }
                                }
                                Rectangle {
                                    width: 85
                                    height: parent.height
                                    color: "#E0E0E0"
                                    border.color: "#A0A0A0"
                                    Text {
                                        id: canCannel
                                        anchors.centerIn: parent
                                        text: "CAN通道"
                                        font.bold: true
                                    }
                                }
                                Rectangle {
                                    width: 60
                                    height: parent.height
                                    color: "#E0E0E0"
                                    border.color: "#A0A0A0"
                                    Text {
                                        anchors.centerIn: parent
                                        text: "传输方向"
                                        font.bold: true
                                    }
                                }
                                Rectangle {
                                    width: 120
                                    height: parent.height
                                    color: "#E0E0E0"
                                    border.color: "#A0A0A0"
                                    Text {
                                        id: idNumber
                                        anchors.centerIn: parent
                                        text: "ID号"
                                        font.bold: true
                                    }
                                }
                                Rectangle {
                                    width: 60
                                    height: parent.height
                                    color: "#E0E0E0"
                                    border.color: "#A0A0A0"
                                    Text {
                                        id: frameType
                                        anchors.centerIn: parent
                                        text: "帧类型"
                                        font.bold: true
                                    }
                                }
                                Rectangle {
                                    width: 60
                                    height: parent.height
                                    color: "#E0E0E0"
                                    border.color: "#A0A0A0"
                                    Text {
                                        id: frameFormat
                                        anchors.centerIn: parent
                                        text: "帧格式"
                                        font.bold: true
                                    }
                                }
                                Rectangle {
                                    width: 60
                                    height: parent.height
                                    color: "#E0E0E0"
                                    border.color: "#A0A0A0"
                                    Text {
                                        id: dataLength
                                        anchors.centerIn: parent
                                        text: "长度"
                                        font.bold: true
                                    }
                                }
                                Rectangle {
                                    width: 245
                                    height: parent.height
                                    color: "#E0E0E0"
                                    border.color: "#A0A0A0"
                                    Text {
                                        id:canData
                                        anchors.centerIn: parent
                                        text: "数据"
                                        font.bold: true
                                    }
                                }
                            }

                            // 数据部分：启用滚动功能
                            Flickable {
                                width: parent.width
                                height: parent.height //- 80  // 保持足够的空间用于按钮等

                                contentWidth: tableBody.width
                                contentHeight: tableBody.height

                                // 数据部分：ListView 用来展示数据
                                ListView {
                                    id: tableBody
                                    width: parent.width
                                    height: contentHeight

                                    model: ListModel {
                                        id: receiveModel
                                        // 初始数据
                                        /*
                                        ListElement { canId: "0x101"; data: "12 34 56" }
                                        ListElement { canId: "0x102"; data: "AB CD EF" }
                                        */
                                    }

                                    // 委托：每行的样式
                                    delegate: Row {
                                        spacing: 1
                                        Rectangle {
                                            width: 35
                                            height: 40
                                            border.color: "#A0A0A0"
                                            Text {
                                                anchors.centerIn: parent
                                                text: model.index
                                            }
                                        }
                                        Rectangle {
                                            width: 120
                                            height: 40
                                            border.color: "#A0A0A0"
                                            Text {
                                                anchors.centerIn: parent
                                                text: model.systentime
                                            }
                                        }
                                        Rectangle {
                                            width: 120
                                            height: 40
                                            border.color: "#A0A0A0"
                                            Text {
                                                anchors.centerIn: parent
                                                text: model. timeflag
                                            }
                                        }
                                        Rectangle {
                                            width: 120
                                            height: 40
                                            border.color: "#A0A0A0"
                                            Text {
                                                anchors.centerIn: parent
                                                text: model.timeflags
                                            }
                                        }
                                        Rectangle {
                                            width: 85
                                            height: 40
                                            border.color: "#A0A0A0"
                                            Text {
                                                anchors.centerIn: parent
                                                text: model.canchennel
                                            }
                                        }
                                        Rectangle {
                                            width: 60
                                            height: 40
                                            border.color: "#A0A0A0"
                                            Text {
                                                anchors.centerIn: parent
                                                text: model.direction
                                            }
                                        }
                                        Rectangle {
                                            width: 120
                                            height: 40
                                            border.color: "#A0A0A0"
                                            Text {
                                                anchors.centerIn: parent
                                                text: model.numer
                                            }
                                        }
                                        Rectangle {
                                            width: 60
                                            height: 40
                                            border.color: "#A0A0A0"
                                            Text {
                                                anchors.centerIn: parent
                                                text: model.type
                                            }
                                        }
                                        Rectangle {
                                            width: 60
                                            height: 40
                                            border.color: "#A0A0A0"
                                            Text {
                                                anchors.centerIn: parent
                                                text: model.format
                                            }
                                        }
                                        Rectangle {
                                            width: 60
                                            height: 40
                                            border.color: "#A0A0A0"
                                            Text {
                                                anchors.centerIn: parent
                                                text: model.length
                                            }
                                        }
                                        Rectangle {
                                            width: 245
                                            height: 40
                                            border.color: "#A0A0A0"
                                            Text {
                                                anchors.centerIn: parent
                                                text: model.data
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }

                    // 实时显示和清空按钮容器
                    Rectangle {
                        id: buttonsContainer
                        width: parent.width * 0.12
                        height: parent.height
                        color: "transparent" // 设置为透明，只显示边框
                        border.color: "black" // 边界框颜色
                        anchors.verticalCenter: parent.verticalCenter

                        Column {
                            anchors.fill: parent
                            spacing: 10
                            //padding: 10

                            CheckBox {
                                id: realTimeCheckBox
                                text: "实时显示"
                                anchors.horizontalCenter: parent.horizontalCenter
                            }

                            Button {
                                id: clearCanData
                                width: buttonsContainer.width * 0.50
                                height: 30
                                text: "清空"
                                anchors.horizontalCenter: parent.horizontalCenter
                                onClicked: {
                                    receiveModel.clear()
                                }

                                background: Rectangle {
                                   border.color: "#C0C0C0" // 边框颜色，浅灰色
                                   border.width: 1       // 边框宽度
                                   color: "#E0E0E0"      // 背景颜色，浅灰色
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}
